import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

const register = () => import("../pages/register/register.vue")
const index = () => import("../pages/index/index.vue")
const detail = () => import("../pages/detail/detail.vue")
const list = () => import("../pages/list/list.vue")
const login = () => import("../pages/login/login.vue")
const search = () => import("../pages/search/search.vue")
const order = () => import("../pages/order/order.vue")
const addressList = () => import("../pages/address/addressList.vue")
const addressAdd = () => import("../pages/address/addressAdd.vue")
const pay = () => import("../pages/pay/pay.vue")

const home = () => import("../pages/home/home.vue")
const cate = () => import("../pages/cate/cate.vue")
const shop = () => import("../pages/shop/shop.vue")
const mine = () => import("../pages/mine/mine.vue")
const test = () => import("../pages/test/test.vue")

const routes = [
  {
    path: '/register',
    component: register,
    meta: {
      title: "注册",
      back: true,
    }
  },
  {
    path: '/index',
    component: index,
    children: [{
        path: "home",
        component: home,
        meta: {
          title: "首页"
        }
      },
      {
        path: "cate",
        component: cate,
        meta: {
          title: "分类"
        }
      },
      {
        path: "shop",
        component: shop,
        meta: {
          title: "购物车"
        }
      },
      {
        path: "mine",
        component: mine,
        meta: {
          title: "个人中心"
        }
      },
    ]
  },
  {
    path: '/detail/:id',
    component: detail,
    name:"详情",
    meta: {
      title: "商品详情",
      back: true
    },
  },
  {
    path: '/list',
    component: list,
    name:"列表",
    meta: {
      title: "商品列表",
      back: true
    }
  },
  {
    path: '/login',
    components:{
      default:login,
      second:test,
    },
    meta: {
      title: "登录",
      register: true
    }
  },
  {
    path: '/search',
    component: search,
    name:"搜索",
    meta: {
      title: "搜索",
      back: true
    },
  },
  {
    path:"/order",
    component:order,
    meta:{
      title:"订单",
      back:true
    }
  },
  {
    path:"/a-list",
    component:addressList,
    name:"地址列表",
    meta:{
      title:"地址列表",
      back:true,
    }
  },
  {
    path:"/a-add",
    component:addressAdd,
    name:"地址添加",
    meta:{
      title:"地址添加",
      back:true,
    }
  },
  {
    path:"/pay",
    component:pay,
    name:"支付页面",
    meta:{
      title:"支付中",
      back:true
    }
  },
  {
    path: "*",
    redirect: "/login"
  }
]

const router = new VueRouter({
  routes, //路由规则
  mode: "hash", //路由模式
  //滚动行为
  scrollBehavior(to, from, savedPosition) {
    if (savedPosition) {
      return savedPosition
    } else {
      return {
        x: 0,
        y: 0
      }
    }
  }
})

//全局前置守卫
router.beforeEach((to, from, next) => {
  // 1.判断前往的路由是 登录|注册， next()
  if (to.path == "/login" || to.path == "/register") {
    next();
    return;
  }
  //判断前往的路由不是 登录|注册 ，判断是否登录了，如果登陆了，next();如果没有登录，next('/login')
  let isLogin = localStorage.getItem("isLogin")
  if (isLogin) {
    next();
    return
  }
  next("/login")
})

//全局后置守卫
router.afterEach((to,from)=>{
  console.log("======全局后置守卫======");
})

export default router